﻿
<template>

  <div v-loading="isLoading">
    <el-popover
        ref="expressionTipPopover"
        placement="bottom"
        width="500"
        trigger="manual"
        v-model="unitExpressionSuggest.tipVisible">

      <el-table :data="computeUnitList.filter(searchByRef)" highlight-current-row empty-text="无匹配数据"
                :key="'computeunitsugguest'+templateInfo.id" @row-click="appendSuggest"
                max-height="400">
        <el-table-column prop="id" label="引用标识">
        </el-table-column>
        <el-table-column prop="name" label="名称">
        </el-table-column>
        <el-table-column prop="yearRelated" label="年份相关" :formatter="(val)=>{
          return val==true?'是':'否';
        }">
        </el-table-column>
      </el-table>
    </el-popover>
    <template>
      <div v-if="this.$route.query.pageType == 'merge_export'">
      <span style="font-weight: 500">组合类型</span>
      <div style="border:1.5px solid #2b83f9;margin-bottom: 15px;margin-top: 5px"></div>
<!--          {{this.templateInfo}}-->

          <query-table ref="template_detail_table" :columns="columns"
                       :style="{'min-height': this.pageHeight-100-210 +'px'}"
                       :table-max-height="tableMaxHeight"
                       :query-fields="queryFields"
                       :detail-fields="infoFields"
                       :append-buttons="appendButtons"
                        show-index
                       base-url="/template/detail"></query-table>

      </div>
      <div >
      <span style="font-weight: 500">模版配置</span>
      <div style="border:1.5px solid #2b83f9;margin-bottom: 15px;margin-top: 5px"></div>
          <el-dialog title="关联信息" :visible.sync="cellLinkDataDlgVisible" :close-on-click-modal="false">
            <el-form :model="cellDataOption">
              <!--          <el-form-item label="标签页名称" :label-width="formLabelWidth">-->
              <!--            <el-input v-model="cellDataOption.sheetName" disabled autocomplete="off"></el-input>-->
              <!--          </el-form-item>-->

              <el-form-item label="单元格所在行" :label-width="formLabelWidth">
                <el-input disabled v-model="cellDataOption.rowIndex"></el-input>
              </el-form-item>
              <el-form-item label="单元格所在列" :label-width="formLabelWidth">
                <el-input disabled v-model="cellDataOption.colIndex"></el-input>
              </el-form-item>
              <el-form-item label="单元格类型" :label-width="formLabelWidth">
                <el-radio-group v-model="cellDataOption.dataType" size="medium">
                  <el-radio-button label="const">提取数据</el-radio-button>
                  <!--              <el-radio-button label="compute">评价结果</el-radio-button>-->
                  <el-radio-button label="expression">自定义公式</el-radio-button>
                  <el-radio-button label="order">序号</el-radio-button>
                  <el-radio-button label="year">年份</el-radio-button>
                </el-radio-group>
              </el-form-item>
              <template v-if="cellDataOption.dataType == 'order'||cellDataOption.dataType == 'year'">

              </template>
              <template v-else-if="cellDataOption.dataType == 'const'||cellDataOption.dataType == 'expression'||cellDataOption.dataType == 'compute'">

                <el-form-item v-if="cellDataOption.dataType=='const'" label="提取字段"
                              :label-width="formLabelWidth">
                  <!--              <el-cascader-->
                  <!--                :props="{emitPath: false}"-->
                  <!--                :show-all-levels="true"-->
                  <!--                :options="computeUnitList"-->
                  <!--                v-model="cellDataOption.data"-->
                  <!--                filterable></el-cascader>-->
                  <!--              <el-select key="constField" v-model="cellDataOption.data" placeholder="请选择" filterable>-->
                  <!--                <el-option-->
                  <!--                  v-for="item in constFieldList"-->
                  <!--                  :key="item.id"-->
                  <!--                  :label="item.name"-->
                  <!--                  :value="item.id">-->
                  <!--                </el-option>-->
                  <!--              </el-select>-->
                  <!--              <el-cascader-->
                  <!--                style="width:100%"-->
                  <!--                v-model="cellDataOption.data"-->
                  <!--                key="const_field_select"-->
                  <!--                :options="constFieldList"-->
                  <!--                :props="{ expandTrigger: 'hover',label:'name',value:'id',emitPath: false}"-->
                  <!--                ></el-cascader>-->
                  <data-select v-model="cellDataOption.data" :data="this.computeUnitList" ></data-select>
                </el-form-item>
                <el-form-item v-if="cellDataOption.dataType=='expression'" label="计算公式"
                              :label-width="formLabelWidth">
                  <!--              <el-cascader :props="recordFieldCascaderProps"-->
                  <!--                           key="input_field_select"-->
                  <!--                           :options="inputTableList"-->
                  <!--                           filterable-->
                  <!--                           v-model="cellDataOption.data"></el-cascader>-->
                  <el-input type="textarea"
                      key="input_expression"
                      @input="handleExpressionInput"
                            @blur="unitExpressionSuggest.tipVisible=false"
                            v-popover:expressionTipPopover
                            ref="expressionInput"
                      clearable
                      v-model="cellDataOption.data"></el-input>
                </el-form-item>
                <el-form-item
                    v-if="cellDataOption.dataType=='expression'&&cellDataOption.data&&cellDataOption.data.length>0"
                    label="" :label-width="formLabelWidth">
                  <el-alert style="line-height:normal"
                            :title="replaceRef2Name(cellDataOption.data)"
                            type="success"
                            :closable="false">
                  </el-alert>
                </el-form-item>
                <el-form-item v-if="cellDataOption.dataType=='compute'" label="计算单元"
                              :label-width="formLabelWidth">
                  <el-cascader
                      key="compute_field_select"
                      :props="{emitPath: false}"
                      :show-all-levels="true"
                      :options="computeUnitList"
                      v-model="cellDataOption.data"
                      filterable></el-cascader>
                  <!--              <el-select key="computeUnit" v-model="cellDataOption.data" placeholder="请选择" filterable clearable>-->
                  <!--                <el-option-->
                  <!--                  v-for="item in computeUnitList"-->
                  <!--                  :key="item.id"-->
                  <!--                  :label="item.name"-->
                  <!--                  :value="item.id"-->
                  <!--                  :disabled="!item.show"-->
                  <!--                >-->
                  <!--                </el-option>-->
                  <!--              </el-select>-->
                </el-form-item>
                <el-form-item label="保留小数位" :label-width="formLabelWidth">
                  <el-input v-model="cellDataOption.digit" type="number"></el-input>
                </el-form-item>
                <el-form-item
                    v-if="!(computeUnitMap[cellDataOption.data]&&computeUnitMap[cellDataOption.data].type=='compute')"
                    label="合计类型" :label-width="formLabelWidth">
                  <el-cascader
                      :props="{emitPath: false}"
                      :show-all-levels="true"
                      :options="sumTypeList"
                      v-model="cellDataOption.sumType"
                      clearable
                      filterable></el-cascader>

                  <!--              <el-select filterable v-model="cellDataOption.sumType" placeholder="请选择">-->
                  <!--                <el-option-->
                  <!--                  v-for="item in sumTypeList"-->
                  <!--                  :key="item.id"-->
                  <!--                  :label="item.name"-->
                  <!--                  :value="item.id">-->
                  <!--                </el-option>-->
                  <!--              </el-select>-->
                </el-form-item>
                <el-form-item
                    v-else-if="computeUnitMap[cellDataOption.data]&&computeUnitMap[cellDataOption.data].type=='compute'"
                    label="" :label-width="formLabelWidth">
                  <el-alert style="line-height:normal"
                            title="非扩展数据"
                            description="该计算单元为汇总计算结果数据，不会自动扩展"
                            type="success"
                            :closable="false">
                  </el-alert>
                </el-form-item>
                <!--            <el-form-item-->
                <!--              label="合计类型" :label-width="formLabelWidth">-->
                <!--              <el-cascader-->
                <!--                :props="{emitPath: false}"-->
                <!--                :show-all-levels="true"-->
                <!--                :options="sumTypeList"-->
                <!--                v-model="cellDataOption.sumType"-->
                <!--                filterable></el-cascader>-->

                <!--            </el-form-item>-->

              </template>

            </el-form>
            <div slot="footer" class="dialog-footer">
              <el-button @click="cellLinkDataDlgVisible = false">取 消</el-button>
              <el-button type="primary" v-if="checkPermission('template:update')&&!templateInfo.publish" @click="updateCellOptionData">保 存</el-button>
            </div>
          </el-dialog>

          <!--      <el-dialog title="导出配置" :visible.sync="globalSettingDlgVisible" :close-on-click-modal="false">-->
          <!--        <el-form :model="templateDataConfig">-->
          <!--          <el-form-item label="合计位置" :label-width="formLabelWidth">-->
          <!--            <el-radio-group v-model="templateInfo.dataConfig.sumPosition" size="medium">-->
          <!--              <el-radio-button label="none">不展示</el-radio-button>-->
          <!--              <el-radio-button label="begin">开头</el-radio-button>-->
          <!--              <el-radio-button label="end">结尾</el-radio-button>-->
          <!--            </el-radio-group>-->
          <!--          </el-form-item>-->
          <!--        </el-form>-->
          <!--        <div slot="footer" class="dialog-footer">-->
          <!--          <el-button @click="globalSettingDlgVisible = false">取 消</el-button>-->
          <!--          <el-button type="primary" @click="updateExportSetting">保 存</el-button>-->
          <!--        </div>-->
          <!--      </el-dialog>-->

          <el-dialog title="标签页配置" :visible.sync="sheetSettingDlgVisible" :close-on-click-modal="false" @close="sheetSettingDlgClose">
            <!--              <el-table id="sheetConfigList" v-if="templateInfo.struct" :data="templateInfo.struct.sheetNameList" border highlight-current-row empty-text="暂无数据"-->
            <!--                        v-loading="isLoading" :key="templateInfo.id+'_sheetlist'" :header-cell-style="{background:'#f5f7fa'}">-->
            <!--                <el-table-column type="index" label="序号" show-overflow-tooltip width="50" align="center">-->
            <!--                </el-table-column>-->
            <!--                <el-table-column label="标签页名称" header-align="center" width="200" show-overflow-tooltip>-->
            <!--                  <template slot-scope="scope">-->
            <!--                    {{scope.row}}-->
            <!--                  </template>-->
            <!--                </el-table-column>-->

            <!--              </el-table>-->
            <el-form :model="cellDataOption">
              <el-form-item label="标签页名称" :label-width="formLabelWidth">
                <el-input v-model="sheetConfig.name" disabled autocomplete="off"></el-input>
              </el-form-item>

              <el-form-item label="编码" :label-width="formLabelWidth">
                <el-input v-model="sheetConfig.code"></el-input>
              </el-form-item>
            </el-form>
            <!--              <el-row>-->
            <!--              <p style="font-size: 16px;">合计位置选择</p>-->
            <!--                <el-radio-group style="margin-left: 20px;" v-model="templateInfo.dataConfig.sumPosition" size="small">-->
            <!--                  <el-radio-button label="none">不展示</el-radio-button>-->
            <!--                  <el-radio-button label="begin">开头</el-radio-button>-->
            <!--                  <el-radio-button label="end">结尾</el-radio-button>-->
            <!--                </el-radio-group>-->
            <!--              </el-row>-->
            <div slot="footer" class="dialog-footer">
              <el-button @click="sheetSettingDlgVisible = false,showSheetIcon=false">取 消</el-button>
              <el-button v-if="!templateInfo.publish" type="primary" @click="updateSheetSetting">保 存</el-button>
            </div>
          </el-dialog>

          <el-row
              v-if="templateInfo.excelPreviewData&&templateInfo.excelPreviewData.sheetList&&templateInfo.excelPreviewData.sheetList.length>0">
            <div style="padding: 0 10px 10px 0;float: right;">
              <!--          <el-button type="primary" size="small" icon="el-icon-setting" @click="globalSettingDlgVisible=true">全局配置-->
              <!--          </el-button>-->
<!--              <el-button v-if="checkPermission('template:update')" type="primary" size="small" icon="el-icon-setting"
                         @click="openSheetSettingDlg">标签页配置
              </el-button>-->
              <el-button type="primary" size="small" icon="el-icon-download" @click="downloadTemplateFile">模板下载</el-button>
              <el-upload
                  style="float: right;margin-left: 15px;"
                  ref="upload"
                  :action="$ctx+'/template/upload'"
                  :show-file-list="false"
                  :data="{id:templateInfo.id}"
                  :on-success="uploadSuccess"
                  :on-error="uploadFailed"
                  accept=".xls,.xlsx">
                <el-button
                    v-if="!templateInfo.publish&&checkPermission('template:update')&&!this.readonly"
                    icon="el-icon-upload" size="small" type="primary">模板上传</el-button>
              </el-upload>

            </div>
            <el-col span="24">
              <!--        <div style="height: 50px;"></div>-->
              <excel-view v-if="templateInfo.excelPreviewData" ref="template" :data="templateInfo.excelPreviewData" @cell-click="cellClick"
                          :min-text-length="4"
                          :max-height="pageHeight-45"
                          :cell-style="templateDataConfigStateStyle" :formatText="cellFormatter"></excel-view>
            </el-col>
          </el-row>
          <el-upload v-else
                     style="margin-top: 20px"
                     ref="upload"
                     :action="$ctx+'/template/upload'"
                     :show-file-list="false"
                     :data="{id:templateInfo.id}"
                     :on-success="uploadSuccess"
                     :on-error="uploadFailed"
                     accept=".xls,.xlsx"
                     drag>
            <i class="el-icon-upload"></i>
            <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
            <div slot="tip" class="el-upload__tip">数据单元格请使用$进行占位，以便进行后续数据关联操作</div>
          </el-upload>
      </div>
    </template>

  </div>


</template>

<script>
    import MetaSelect from "../../components/meta-select.vue";
    import QueryTable from "../../components/query-table";

    export default {
        name: "TemplateInfo",
      components: {QueryTable, MetaSelect},
        props: {
            pageHeight: { type: Number, default: 600 },
        },
      $$route:{
        meta:{
          title:'模板详情'
        }
      },
        data() {
            return {
              activeName:'customType',
              unitExpressionSuggest: {
                inputSearchKey: null,
                tipVisible: false,
              },
              readonly:false,
              infoFields: [
                {
                  id: 'name',
                  name: '名称',
                  rules: [{required: true, message: "请输入名称", trigger: "blur"}],
                  colSpan: 24,
                },
                {id: 'areaMark', name: '新老区', colSpan: 12, component: {id: 'meta-select', type: 'area-mark'}},
                {
                  id: 'region',
                  name: '大区',
                  colSpan:12,
                  listen: this.batchInfo,
                  component: {id: 'meta-select', type: 'oil-region'},
                  isHide: () => {
                    return this.templateInfo.tag == 'gas'
                  }
                },
                {
                  id: 'region', name: '大区', colSpan: 12, component: {id: 'meta-select', type: 'gas-region'}, isHide: () => {
                    return this.templateInfo.tag == 'oil'
                  }
                },
                {
                  id: 'capacityType',
                  name: '产能类型',
                  colSpan: 12,
                  component: {id: 'meta-select', type: 'oil-capacity-type'},
                  isHide: () => {
                    return this.templateInfo.tag == 'gas'
                  }
                },
                // {
                //   id: 'capacityType',
                //   name: '产能类型',
                //   colSpan:12,
                //   component: {id: 'meta-select', type: 'gas-capacity-type'},
                //   isHide: () => {
                //     return this.templateInfo.tag == 'oil'
                //   }
                // },
                {
                  id: 'displacementMethod',
                  name: '驱替方式',
                  colSpan: 12,
                  component: {id: 'meta-select', type: 'oil-displacement-method'},
                  isHide: () => {
                    return this.templateInfo.tag == 'gas'
                  }
                },
                {
                  id: 'displacementMethod',
                  name: '驱替方式',
                  colSpan: 12,
                  component: {id: 'meta-select', type: 'gas-displacement-method'},
                  isHide: () => {
                    return this.templateInfo.tag == 'oil'
                  }
                },
                {
                  id: 'poolType',
                  name: '油气藏类型',
                  colSpan: 12,
                  component: {id: 'meta-select', type: 'oil-pool-type-new'},
                  isHide: () => {
                    return this.templateInfo.tag == 'gas'
                  }
                },
                {
                  id: 'poolType',
                  name: '油气藏类型',
                  colSpan: 12,
                  component: {id: 'meta-select', type: 'gas-pool-type'},
                  isHide: () => {
                    return this.templateInfo.tag == 'oil'
                  }
                },
                {id: 'passed', name: '达标情况', component: {id: 'meta-select', type:'pass-type',hideRoot: true}, colSpan: 12},
                {id: 'templateId', name: '模版ID', defaultValue:this.$route.query.id,isHide:()=>{return true}, colSpan: 12},

              ],
              queryFields:[
                {
                  id: 'templateId',
                  name: '模板id',
                  hide:true,
                  defaultValue:this.$route.query.id
                },{
                  id: 'name',
                  name: '名称',
                  colSpan: 5
                },
              ],
              appendButtons:[
                {text: '新增', type: 'success', operation: 'create',isHide:()=>{
                  return JSON.parse(this.$route.query.readonly)
                }},
              ],
              columns:[
                {id: 'name', name: '名称',},
                {id: 'customType', name: '组合类型', width: 460},
                {
                  id: 'operation', name: '操作', type: 'button', width:290, children: [
                    {text: '编辑',type:'success', operation: 'edit'},
                    {text: '上移', type:'primary', click:(row)=>{this.moveUp(row)}},
                    {text: '下移', type:'primary', click:(row)=>{this.moveDown(row)}},
                    {text: '删除', type:'danger', operation: 'delete'},
                  ]
                  , isHide:()=>{ return this.readonly}
                }
              ],

                templateInfo: {publish:false,state: 0},
                isLoading: true,
                formLabelWidth: '120px',
                computeTreeData: [],
                // sheetConfigMap: {},
                cellDataOption: {},
                sheetConfig:{},
                cellLinkDataDlgVisible: false,
                globalSettingDlgVisible: false,
                sheetSettingDlgVisible: false,
                sumTypeList: [],
                computeUnitList: [],
                computeUnitMap: [],
                sensAnalysisItemList: [],
                showSheetIcon: false,
                fieldTypeList: [],
                inputFieldList: [],
                constFieldList: [],
              recordFieldCascaderProps: {
                label: 'name',
                value: 'id',
                emitPath: false,
                children: 'fieldList',
              },
              inputTableList: [],
            }
        },
        computed: {
          tableMaxHeight(){
            return this.pageHeight-100-300;
          }
        },
        created: function () {
        },
        mounted() {
            const modelId = this.$route.query.id;
            this.readonly = JSON.parse(this.$route.query.readonly)
            this.loadTemplateInfo(modelId);
            this.loadSumType();
            this.loadFieldData();
            // this.loadComputeUnitList('');
        },
        methods: {
          loadFieldData() {
            this.$get("/template/field/data",{},(res)=>{
              this.computeUnitList = res.data
            })
          },
          moveUp(row) {
            if (row.sort ==0) {
              return
            }
            this.$post("/template/detail/moveUp?id="+row.id,{},(res)=>{
              this.$refs['template_detail_table'].reload()
              this.$message.success("保存成功")

            })
          },
          moveDown(row){
            let dataList = this.$refs['template_detail_table'].getDataList()
            if (row.sort ==dataList.length-1) {
              return
            }
            this.$post("/template/detail/moveDown?id="+row.id,{},(res)=>{
              this.$refs['template_detail_table'].reload()
              this.$message.success("保存成功")
            })
          },
          loadInputTableList: function (modelId) {
            // this.unitLoading = true;
            this.$get("/table/fulldata?modelId=" + modelId, {}, (response) => {
              let list = [];
              for(let item of response.data) {
                if(item.fieldList&&item.fieldList.length>0) {
                  list.push(item);
                }
              }
              this.inputTableList = list;
            }, () => {
              // this.unitLoading = false;
            });
          },
            // loadInputFieldList: function (type) {
            //     this.$get("/field/data", {modelId:'common'}, (response) => {
            //       let inputList = [];
            //       // console.log(response.data)
            //       for(let item of response.data) {
            //           inputList.push(item);
            //       }
            //         this.inputFieldList = inputList;
            //     });
            // },
            loadConstFieldList: function (type) {
                this.$get("/template/field/read/list_option?type=" + type, {}, (data) => {
                    this.constFieldList = data.data;
                });
            },
            loadTemplateInfo: function (id) {
                this.$get("/template/info/" + id, {}, (response) => {
                  let templateInfo = response.data;
                  let config = templateInfo.dataConfig;
                  if(config&&config.sheetConfigList) {
                    let sheetConfigMap = {};
                    for(let item of config.sheetConfigList) {
                      sheetConfigMap[item.name] = item;
                      let cellDataConfigMap = {};
                      if(item.cellConfigList) {
                        for(let cellConfig of item.cellConfigList) {
                          cellDataConfigMap[cellConfig.rowIndex+'_'+cellConfig.colIndex] = cellConfig;
                        }
                        item.cellDataConfigMap = cellDataConfigMap;
                      }
                    }
                    config.sheetConfigMap = sheetConfigMap;
                  }
                  this.templateInfo = templateInfo;
                    // this.$emit("add-bread", {name: this.templateInfo.name, parent: this.$route.query.parent});
                    // this.loadInputFieldList(this.templateInfo.type);
                    // this.loadConstFieldList(this.templateInfo.type);
                  //  this.loadInputTableList('common')
                }, () => {
                    this.isLoading = false;
                });


            },

            loadSumType: function () {
                this.$get("/meta/type/sum-type", {}, (data) => {
                    // this.sumTypeList = response.data.data;
                    let resultList = [];
                    for (let item of data.data) {
                        resultList.push({label: item.name, value: item.id});
                    }
                    let unitSumList = [];
                    for (let unitItem of this.computeUnitList) {
                        if (!unitItem.children) {
                            continue;
                        }
                        let unitList = [];
                        for (let unit of unitItem.children) {
                            if (unit.type == 'compute') {
                                unitList.push(unit);
                            }
                        }
                        if (unitList.length > 0) {
                            unitSumList.push({label: unitItem.label, value: unitItem.value, children: unitList});
                        }
                    }
                    if (unitSumList.length > 0) {
                        resultList.push({label: '模型选择', value: 'compute', children: unitSumList})
                    }
                    this.sumTypeList = resultList;
                });
            },

            updateCellOptionData: function () {
                // cellLinkDataDlgVisible
              const loading = this.openLoading('正在处理，请稍后...');
                this.$post("/template/config/cell/update", this.cellDataOption, (data) => {
                    this.$message({
                        message: '更新成功',
                        type: 'success'
                    });
                    this.cellLinkDataDlgVisible = false;
                   // this.loadTemplateInfo(this.templateInfo.id);
                },()=>{
                  loading.close();
                });
            },

            cellClick: function (row, column, cell, event, sheet) {
                if (row[column.property] != '$') {
                    return;
                }
                let key = row.rowNum + 1 + sheet.frozenRow + "_" + (parseInt(column.property.replace('col', '')) + 1);
                let option = null;
                console.log(this.templateInfo.sheetConfigMap)
                let sheetConfig = this.templateInfo.dataConfig.sheetConfigMap[sheet.name];
                if (sheetConfig && sheetConfig.cellDataConfigMap) {
                    option = sheetConfig.cellDataConfigMap[key];
                }
                if (option)
                    this.cellDataOption = {
                    id:option.id,
                        colIndex: option.colIndex
                        , dataType: option.dataType
                        , order: option.order
                        , rowIndex: option.rowIndex
                        , sheetName: option.sheetName
                        , templateId: this.templateInfo.id
                        , data: option.data
                        , sumType: option.sumType
                        // ,sumPosition:option.sumPosition
                        , digit: option.digit
                        , mergeSame: option.mergeSame
                    };
                this.cellLinkDataDlgVisible = true;
            },

            uploadSuccess: function (data) {
                if (data.code != 0) {
                    this.$message({
                        message: data.msg,
                        type: 'warning'
                    });
                    return;
                }
                this.$message({
                    message: '上传成功',
                    type: 'success'
                });
                this.loadTemplateInfo(this.templateInfo.id);
            },
            uploadFailed: function () {
                this.$message.error('上传失败');
            },

            templateDataConfigStateStyle: function ({row, column, rowIndex, columnIndex}, sheet) {
                if (row[column.property] != "$") {
                    return;
                }
                let sheetName = sheet.name;
                let key = row.rowNum + 1 + sheet.frozenRow + "_" + (parseInt(column.property.replace('col', '')) + 1);
                let completeStyle = {'background-color': '#f0f9eb','color': '#409EFF',cursor:'pointer','text-align':'center'};
                let config = this.templateInfo.dataConfig;
                if (config.sheetConfigMap
                    && config.sheetConfigMap[sheetName]
                    && config.sheetConfigMap[sheetName].cellDataConfigMap[key]
                    && (config.sheetConfigMap[sheetName].cellDataConfigMap[key].dataType == 'order'||config.sheetConfigMap[sheetName].cellDataConfigMap[key].dataType == 'year')) {
                    return completeStyle;
                } else if (config.sheetConfigMap
                    && config.sheetConfigMap[sheetName]
                    && config.sheetConfigMap[sheetName].cellDataConfigMap[key]
                    && config.sheetConfigMap[sheetName].cellDataConfigMap[key].data) {
                    return completeStyle;
                } else {
                    return {'background-color': '#fdf6ec','color': '#409EFF',cursor:'pointer','text-align':'center'}
                }


            },
            cellFormatter: function ({row, column, cellValue, index},sheet) {

                if (row[column.property] != "$") {
                    return row[column.property];
                }
                let sheetName = sheet.name;
                let key = row.rowNum + 1 + sheet.frozenRow + "_" + (parseInt(column.property.replace('col', '')) + 1);
                let config = this.templateInfo.dataConfig;

                if(this.templateInfo.publish||!this.checkPermission('template:update')) {
                    return '查看数据';
                }
                if (config.sheetConfigMap
                    && config.sheetConfigMap[sheetName]
                    && (config.sheetConfigMap[sheetName].cellDataConfigMap[key].dataType == 'order'||config.sheetConfigMap[sheetName].cellDataConfigMap[key].dataType == 'year')) {
                    return '编辑数据';
                } else if (config.sheetConfigMap
                    && config.sheetConfigMap[sheetName]
                    && config.sheetConfigMap[sheetName].cellDataConfigMap[key].data) {
                    return '编辑数据';
                } else {
                    return '关联数据';
                }


            },

            downloadTemplateFile: function () {
                window.open(this.$ctx+"/template/download?id=" + this.templateInfo.id);
            },
          openSheetSettingDlg(){
              let sheetName = this.$refs['template'].getActiveTab();
              this.sheetConfig = this.templateInfo.dataConfig.sheetConfigMap[sheetName];
              this.sheetSettingDlgVisible=true;
          },
          sheetSettingDlgClose(){
            this.sheetConfig = {};
          },
          updateSheetSetting(){
            this.$post("/template/config/sheet/update", this.sheetConfig, (data) => {
              this.$message({
                message: '更新成功',
                type: 'success'
              });
              this.sheetSettingDlgVisible = false;
              this.loadTemplateInfo(this.templateInfo.id);
            });
          },
          handleExpressionInput: function (value) {
            let keywordReg = new RegExp('\\+|-|\\*|/|\\(|\\)|\\{|\\}|\\[|\\]', "g");

            let tmp = value.replace(keywordReg, ' ');
            tmp = tmp.split(' ');
            if (tmp.length <= 0) {
              return;
            }

            this.unitExpressionSuggest.inputSearchKey = tmp[tmp.length - 1];
            this.unitExpressionSuggest.tipVisible = true;

          },
          searchByRef: function (data) {
            let value = this.unitExpressionSuggest.inputSearchKey;
            if (!value || value == null) {
              this.unitExpressionSuggest.tipVisible = false;
              return false;
            }
            return data.name.toLowerCase().includes(value.toLowerCase()) || data.id.toLowerCase().includes(value.toLowerCase());
          },
          appendSuggest: function (row) {
            // if(this.computeUnit.type!='expression') {
            //     return;
            // }
            let reg = new RegExp('(.*)' + this.unitExpressionSuggest.inputSearchKey, "i");
            this.cellDataOption.data = this.cellDataOption.data.replace(reg, '$1' + row.id);
            this.unitExpressionSuggest.inputSearchKey = null;
            this.$refs['expressionInput'].focus();
          },
          replaceRef2Name: function (value,markRef) {
            let regList1 = [];
            regList1.push(new RegExp('(\\+|-|\\*|/|\\(|\\)|\\{|\\}|\\[|\\]|,)', "g"));
            regList1.push(new RegExp('(==)', "g"));
            regList1.push(new RegExp('(>=)', "g"));
            regList1.push(new RegExp('(<=)', "g"));
            regList1.push(new RegExp('(>)', "g"));
            regList1.push(new RegExp('(<)', "g"));
            let keywordReg3 = new RegExp('(#map)', "g");
            let keywordReg4 = new RegExp('(#list)', "g");

            let tmp = ' ' + value + ' ';
            for (let reg of regList1) {
              tmp = tmp.replace(reg, ' $1 ');
            }
            tmp = tmp.replace(keywordReg3, ' (所有数据)');
            tmp = tmp.replace(keywordReg4, ' (所有数据)');
            let keywordReg5 = new RegExp('(< =)', "g");
            let keywordReg6 = new RegExp('(> =)', "g");
            tmp = tmp.replace(keywordReg5, '<=');
            tmp = tmp.replace(keywordReg6, '>=');
            for (let unit of this.computeUnitList) {
              if (tmp.indexOf(unit.id) < 0) {
                continue;
              }
              let reg = new RegExp(' ' + unit.id + ' ', "g");
              let replaceStr = unit.name;
              if(unit.id==markRef) {
                replaceStr = "<span style='color:red;'>"+replaceStr+"</span>";
              }
              tmp = tmp.replace(reg, replaceStr);
            }
            return tmp;
          },

        },

    }
</script>
